<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>生命周期</title>
		<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
	</head>
	<body>
		<div id="app">
			{{ msg }}
		</div>
		<script type="text/javascript">
			const vm = new Vue({
				el:'#app',
				data:{},
				beforeCreate(){//页面渲染前
					//在实例初始化之后,进行数据侦听和事件/侦听器的配置之前同步调用。
					console.log("beforeCreate调用");
				},
				created(){//页面渲染完毕  方法、计算属性等渲染完毕
					//还没有生成 set get方法所以不会报错
					this.msg = "hello";
				},
				beforeMount(){
					console.log("beforeMount调用");
				},
				mounted(){
					console.log("mounted调用");
				},
				beforeUpdate(){
					console.log("beforeUpdate调用");
				},
				updated(){
					console.log("updated调用");
				},
				activated(){
					console.log("activated调用");
				},
				deactivated(){
					console.log("deactivated调用");
				},
				beforeDestroy(){
					console.log("beforeDestroy调用");
				},
				destroyed(){
					console.log("destroyed调用");
				},
				errorCaptured(){
					console.log("errorCaptured调用");
				}
				
			})
		</script>
	</body>
</html>
